<template>
  <div>
    <div>{{ text }}</div>
    <button @click="start">开始</button>
    <button @click="stop">结束</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      text: "让我们嗨起来~~~",
      intervalId: null
    }
  },
  methods: {
    start() {
      console.log(this)
      if (this.intervalId != null) {
        return;
      }

      this.intervalId = setInterval(() => {
        this.text = this.text.substring(1) + this.text.substring(0,1)
      }, 100);
    },
    stop() {
      clearInterval(this.intervalId);
      this.intervalId = null;
    }
  }
}
</script>

<style scoped>

</style>
